<template>
  <Row>
    <Col :span="12">
      <!-- <Icon class="el-icon-menu"></Icon> -->
      <i id="navLogo" class="icon iconfont icon-logo-jgzl"></i>
    </Col>
    <Col :span="12">
      <template>
        <Dropdown v-if="name" class="userInfo">
          <span class="el-dropdown-link">
            <Icon class="el-icon-s-custom"></Icon>
            {{ name }}
            <Icon class="el-icon-arrow-down"></Icon>
          </span>
          <DropdownMenu slot="dropdown">
            <DropdownItem>个人中心</DropdownItem>
            <DropdownItem>退出</DropdownItem>
          </DropdownMenu>
        </Dropdown>
        <Link v-else href="/" class="userInfo">请登录</Link>
      </template>
    </Col>
  </Row>
</template>
<script>
import {
  Row,
  Col,
  Icon,
  Dropdown,
  DropdownMenu,
  DropdownItem,
  Link
} from "element-ui";
export default {
  name: "SysHeader",
  data() {
    return {
      name: window.sessionStorage.getItem("user") || ""
    };
  },
  methods: {},
  components: {
    Row,
    Col,
    Icon,
    Dropdown,
    DropdownMenu,
    DropdownItem,
    Link
  }
};
</script>
<style lang="scss" scoped>
#navLogo {
  display: block;
  font-size: 30px;
  line-height: 60px;
  width: 280px;
  text-align: center;
}
.userInfo {
  padding-top: 20px;
  float: right;
}
</style>
